/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/
.asterisk {
    display: none;
}

/* Hintergrundfarbe der Seite */
body {
    background-color: #c3cee6;
}

#survey-nav {
    background-color: #c3cee6 !important;
}

.min-vh-100 {
    min-height: 0 !important;
}

.top-content {
    padding-top: .5em;
}

.main-question-container {
    width: 100%;
    max-width: 80%;
    margin: 50px auto;
    background: white;
    border-radius: 12px;
    padding: .5em;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
    .main-question-container {
        margin: 10px auto;
        max-width: unset;
    }

    .header-container {
        flex-direction: column;
        padding: unset !important;
    }
}


.question-container {
    margin: 0;
}

.question-number {
    color: #000 !important;
}

.welcome-container {
    padding: 2.5em;
}

.welcome-container .header-container {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: center;
    /* Abstand zwischen SVG und Text */
    height: 100%;
    margin-bottom: 50px;
}

.welcome-container .header-logo {
    width: 80px;
    /* Breite der SVG */
    height: auto;
}

.welcome-container .header-text {
    font-size: 30px;
    font-weight: 700;
    color: #333;
    margin-bottom: 10px;
    /* Dunkelgrau für besseren Kontrast */
}

.welcome-container .header-sub-text {
    font-weight: 1.3rem;
    font-weight: 400;
    font-size: 24px;
    color: #333;
}


.btn-primary {
    border-radius: 10px;
    background-color: #A4B3CE;
    border-color: #A4B3CE;
    color: #000;
}

.btn-primary:hover {
    color: #000;
    background-color: #BAD267;
    border-color: #BAD267;
}

.list-radio.with-checkboxes .checkbox-item {
    padding-left: 3px;
}

.list-radio.with-checkboxes .checkbox-item input[type="radio"]:indeterminate+label::after {
    display: none;
}

.question-image svg {
    display: block;
    margin: 0 auto;
    /* Zentriert das Bild horizontal */
    max-width: 100%;
    /* Optional: Verhindert, dass es zu groß wird */
    margin-bottom: 10px;
}

.space-col {
    margin: 0;
}

.form-check .btn-check+.btn {
    color: #000;
    padding: 2em;
    background-color: #ffffff;
    border: none;
    box-shadow: 2px 2px 10px rgba(217, 217, 217, 1);
}

.form-check .btn-check+.btn:hover {
    background-color: #BAD267;
}

.form-check .btn-check:checked+.btn-primary {
    background-color: #BAD267;
}

.max-three-checkboxes .radio-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    /* Abstand zwischen den Optionen */
}


.max-three-checkboxes .radio-list .answer-item {
    width: calc(33.333% - 10px);
    /* 3 Spalten mit Abstand */
}

#navigator-container{
    padding-top: 1rem;
}

.privacy{
    margin: unset;
}
.privacy .ls-privacy-head{
    font-weight: 200 !important;
}
.privacy .ls-privacy-block{
    font-weight: 200 !important;
    font-size: 11px !important;
}
#questionG02Q02 .em_error,
#questionG02Q02 .input-error,
#questionG02Q02 .errormandatory {
  display: none !important;
}